import { debounce } from 'lodash'
import { store } from '@/utils/commonJs/permission.js'
const hasModal = () => {
  return [...document.querySelectorAll('.v-modal')].length
}
export const changeActiveTab = ({
  el,
  isIncrease,
  boxClass = 'el-tabs__nav',
  itemClass = 'el-tabs__item',
  activeClass = 'is-active'
}) => {
  if (hasModal()) {
    return
  }
  const tabBox = el.getElementsByClassName(boxClass)[0]
  const children = [...tabBox.getElementsByClassName(itemClass)]
  const index = children.findIndex(i => i.className.includes(activeClass))
  const len = children.length
  if (isIncrease) {
    const cmpIndex = index === len - 1 ? 0 : (index + 1)
    const activeItem = children[cmpIndex]
    activeItem.click()
  } else {
    const cmpIndex = index === 0 ? len - 1 : (index - 1)
    const activeItem = children[cmpIndex]
    activeItem.click()
  }
}

export const changeActiveList = debounce(({
  list,
  isIncrease,
  el
}) => {
  if (hasModal()) {
    return
  }
  const { boxClass, activeClass, itemClass } = list
  const box = el.getElementsByClassName(boxClass)[0]
  const children = [...box.getElementsByClassName(itemClass)]
  const tabsDom = children.filter(i => i.className.includes(itemClass))
  const index = tabsDom.findIndex(i => i.className.includes(activeClass))
  console.log(box, tabsDom, el.getElementsByClassName(boxClass), el)
  if (typeof index !== 'number') {
    return
  }
  if (isIncrease) {
    const willActive = index + 1
    if (tabsDom[willActive]) {
      tabsDom[willActive].click()
    } else {
      tabsDom[0] && tabsDom[0].click()
    }
  } else {
    const willActive = index - 1
    if (tabsDom[willActive]) {
      tabsDom[willActive].click()
    } else {
      tabsDom[tabsDom.length - 1] && tabsDom[tabsDom.length - 1].click()
    }
  }
}, 100)
